<template>
	<div>
		<!-- 浇铸总图 -->
		<div class="flex">
			<!-- 浇次节奏 -->
			<watering-rhythm></watering-rhythm>

			<!-- 炉次列表 -->
			<furnace-list class="hidden"></furnace-list>
		</div>

		<div class="flex align-start margin-top">
			<div class="flex-sub hidden">
				<div class="flex align-start">
					<!-- 钢包信息 -->
					<div class="ladleInformation-box">
						<ladleInformation></ladleInformation>
					</div>

					<div class="flex border-solid bg-tm radius-sm margin-left flex-sub hidden" style="height: 710px;">
						<!-- 铸流图 -->
						<div class="castingFlow-box margin-lr flex-sub flex justify-center align-center">
							<castingFlow></castingFlow>
						</div>

						<!-- 中包信息 -->
						<div class="flex-sub hidden">
							<packageInfor></packageInfor>
						</div>
					</div>
				</div>

				<!-- 铸流生产信息表 -->
				<div class="margin-top hidden">
					<productionInfor></productionInfor>
				</div>
			</div>

			<!-- 炉次检化验列表 -->
			<div class="margin-left test-list-box hidden">
				<testList></testList>
			</div>
		</div>
	</div>
</template>

<script setup>
	import autofit from 'autofit.js' //自适应
	
	import wateringRhythm from './components/wateringRhythm.vue'; //浇次节奏
	import furnaceList from './components/furnaceList.vue'; //炉次列表
	import ladleInformation from './components/ladleInformation.vue'; //钢包信息
	import castingFlow from './components/castingFlow.vue'; //铸流图
	import packageInfor from './components/packageInfor.vue'; //中包信息
	import productionInfor from './components/productionInfor.vue'; //铸流生产信息表
	import testList from './components/testList.vue'; //炉次检化验列表

	import { ref, onUnmounted } from 'vue';
		
	// autofit.init({
	// 	el: 'body',
	// 	dh: 1080,
	// 	dw: 1920,
	// 	resize: true,
	// 	allowScoll: true,
	// 	ignore:['div[id*="el-popper-container"]'],
	// }) //初始化自适应
	
	onUnmounted(()=>{
		// autofit.off();	//关闭自适应
	})
	
</script>

<style lang="scss" scoped>
	.ladleInformation-box {
		// flex: 0 0 290px;
		flex-basis: 21.5%;
	}

	.castingFlow-box {
		// flex: 0 0 480px;
	}

	.test-list-box {
		// flex: 0 0 390px;
		flex-basis: 23%;
	}
</style>